<?php
header("Content-Type: text/html;charset=utf-8");
$title = 'GE集团2018中国国际进口博览会线上展厅';
$desc = '2018中国国际进口博览会@GE集团';
$link = 'http://www.dasvidaniyalife.com/html5';
$imgUrl = 'http://cdn.dasvidaniyalife.com/share.png';
include_once "./share_package.php";
?>
<!DOCTYPE html>
<html>
<head>
    <meta name="author" content="">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link type="text/css" rel="stylesheet" href="css/common.css?v=31">
    <link type="text/css" rel="stylesheet" href="css/page.css?v=5102">
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <script src="js/jquery-1.8.3.min.js?v=1"></script>
    <script src="js/common.js?v=1"></script>
    <script src="js/jquery.imgpreload.js?v=1"></script>
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script src="https://cdn.bootcss.com/Base64/1.0.1/base64.js"></script>
    <title>GE@CIIE虚拟展台</title>

    <style type="text/css">
        @font-face {
            font-family: 'hyzhongyuanjregular';
            src: url('http://cdn.dasvidaniyalife.com/font.ttf');
        }

        p {
            font-family: 'hyzhongyuanjregular';
            font-size: 15px;
        }

        input,
        textarea {
            -webkit-user-select: auto !important;
            -khtml-user-select: auto !important;
            -moz-user-select: auto !important;
            -ms-user-select: auto !important;
            -o-user-select: auto !important;
            user-select: auto !important;
        }

        #vedioFlv {
            position: absolute;
            left: 100%;
            right: 0;
            bottom: 0;
            top: 0;
            transform: rotate(90deg);
            transform-origin: 0% 0%;
        }

        .imgX {
            position: absolute;
            top: 0px;
            left: 0;
            bottom: 0px;
            /* position: relative; */
            width: 100%;
            height: 100%;
        }

        .slide {
            position: absolute;
            right: 0;
            bottom: 0;
            top: 0;
            width: 100%;
            display: none;
            height: 100%;
        }

        .slide .img img {
            width: 100% !important;
            height: 100% !important;
            position: absolute;
            top: 0;
            left: 0;
        }

        .slide .img {
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            top: 0;
            transition: width 0.4s, height 0.4s, top 0.4s, left 0.4s, z-index 0.4s;
        }

        .slide .img1 {
            width: 100%;
            height: 100%;
            /*top: 30%;
    left: -50%;*/
            z-index: 1;
        }

        .slide .img2 {
            width: 100%;
            height: 100%;
            /*top: 20%;*/
            /*left: -20%;*/
            z-index: 2;
        }

        .slide .img3 {
            width: 100%;
            height: 100%;
            /*top: 10%;*/
            /*left: 10%;*/
            z-index: 3;
        }

        .slide .img4 {
            width: auto;
            height: 100%;
            /*top: 20%;
    left: 60%;*/
            z-index: 2;
        }

        .slide .img5 {
            width: 100%;
            height: 100%;
            /*top: 30%;
    left: 110%;*/
            z-index: 1;
        }

        /* .slide-bt {
    position: absolute;
    left: 50%;
    bottom: 13%;
    z-index: 10;
}
.slide .slide-bt .on {
    background: #ffd200;
} */
    </style>
    <script>
        // 图片加载
        var imgNum = 0;
        var images = [];
        $(function () {
            preLoadImg();
        });

        //里面有两种方式
        function preLoadImg() {
            //第一种方式：通过dom方法获取页面中的所有img，包括<img>标签和css中的background-image
            /*get all imgs those tag is <img>*/
            var imgs = document.images;
            for (var i = 0; i < imgs.length; i++) {
                images.push(imgs[i].src);
            }
            //get all images in style
            var cssImages = getallBgimages();
            for (var j = 0; j < cssImages.length; j++) {
                images.push(cssImages[j]);
            }
            //第二种方式：把所有该网页上用到的图片文件都预先放入一个数组里
            $.imgpreload(['http://cdn.dasvidaniyalife.com/tb1.png', 'http://cdn.dasvidaniyalife.com/logo2.png'], function () {
                //此处是显示进度百分比时需要用到的背景图，这个可以先加载进去
            });
            /*这里是真正的图片预加载 preload*/
            $.imgpreload(images, {
                each: function () {
                    /*this will be called after each image loaded*/
                    var status = $(this).data('loaded') ? 'success' : 'error';
                    if (status == "success") {
                        var v = (parseFloat(++imgNum) / images.length).toFixed(2);
                        $("#inum").html(Math.round(v * 100) + "%");
                    }
                },
                all: function () {
                    /*this will be called after all images loaded*/
                    $("#inum").html("100%");
                    $(".loading").hide();
                }
            });
        }

        function getallBgimages() {
            var url, B = [],
                A = document.getElementsByTagName('*');
            A = B.slice.call(A, 0, A.length);
            while (A.length) {
                url = document.deepCss(A.shift(), 'background-image');
                if (url) url = /url\(['"]?([^")]+)/.exec(url) || [];
                url = url[1];
                if (url && B.indexOf(url) == -1) B[B.length] = url;
            }
            return B;
        }

        document.deepCss = function (who, css) {
            if (!who || !who.style) return '';
            var sty = css.replace(/\-([a-z])/g, function (a, b) {
                return b.toUpperCase();
            });
            if (who.currentStyle) {
                return who.style[sty] || who.currentStyle[sty] || '';
            }
            var dv = document.defaultView || window;
            return who.style[sty] ||
                dv.getComputedStyle(who, "").getPropertyValue(css) || '';
        }
        Array.prototype.indexOf = Array.prototype.indexOf ||
            function (what, index) {
                index = index || 0;
                var L = this.length;
                while (index < L) {
                    if (this[index] === what) return index;
                    ++index;
                }
                return -1;
            }
    </script>
</head>

<body>
<div style="display:none;"><img src="http://cdn.dasvidaniyalife.com/logo2.png" alt=""></div>
<div class="loading">
    <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="pic1"/>
    <div style=" width: 50px;height: 50px;position: absolute;background-size: 100%;top: 46%;left: 43.5%;">
        <img width="100%" height="100%" src="http://cdn.dasvidaniyalife.com/logo2.png"/>
    </div>
    <div class="posa text1">LOADING...
        <div id="inum" class="text2"></div>
    </div>
</div>
<script type="text/javascript">
    $.ajax({
        url: 'http://www.dasvidaniyalife.com:3000/count',
        type: 'post',
        success: function (res) {
            $("#count").empty()
            $("#count").append("您是" + JSON.parse(res)[0].count + "位访客")
        }
    })
</script>
<div class="index1">
    <img class="ipic" src="http://cdn.dasvidaniyalife.com/newindex/page1.jpg"/>
    <p id="count"></p>
</div>
<script>
    $("#count").css("height", window.screen.width + "px");
    $("#count").css("line-height", window.screen.width + (window.screen.width * 0.25) + "px");
    var topv = ((window.screen.height - $("#count").width()) / 2) - 35 + "px"
    $("#count").css("top", topv);
</script>
<div class="index0" style="background: url(http://cdn.dasvidaniyalife.com/page2.jpg);">
    <div style="position: relative;width: 100%;height: 100%;">
        <span id="vedioGoBack" class="gobackBoxButton" data-last=".index1,.index3">返回</span>
        <div class="playBotton"
             style=" background: url(http://cdn.dasvidaniyalife.com/timg.jpg);background-size: 100% 100%;border-radius: 100%;position: absolute;font-size: 12px;left: 43%;top: 46%; width: 14%;height: 8%;color: white;z-index: 999999;transform: rotate(90deg);text-align: center;">
        </div>
        <video style="object-fit:fill" x5-video-player-type='h5' x5-video-orientation="portraint"
               x-webkit-airplay="true"
               playsinline webkit-playsinline="true" id="vedioFlv" onpause="pauseA()" preload="load"
               poster="http://cdn.dasvidaniyalife.com/bgvedio.jpg">
            <source src="http://cdn.dasvidaniyalife.com/vedio.mp4" type="video/mp4">
        </video>
        <!-- <button id="vedioGoBack" class="indexButton" style="position:absolute;bottom: 0.1rem;right: 5%;width:0.4rem;height:0.4rem;background: url(http://cdn.dasvidaniyalife.com/gb.png)no-repeat 45% 45%;border: none;">
    </button> -->
        <span id="vedioGoBack" class="indexButton"
              style="padding:10px;font-size: 16px;transform: rotate(90deg);position:absolute;bottom: 5%;right: -1%;border: none;color: #ffffff">
					跳过
				</span>
    </div>
</div>
<script>
    $("#vedioFlv").css("height", window.screen.width + "px");
    $("#vedioFlv").css("width", window.screen.height + "px");
</script>
<div class="index2">
    <span class="gobackBoxButton" data-last=".index0,.index2,.index3">返回</span>
    <img src="http://cdn.dasvidaniyalife.com/newindex/page3.jpg" class="ipic"/>
</div>
<div class="index3">
    <span class="gobackBoxButton" data-last=".index2,.index3"
          style="display: block;padding: 10px;position: absolute;color: white;font-size: 16px;transform: rotate(90deg);top: 5%;right:-1%;z-index: 99999;">返回</span>
    <img src="http://cdn.dasvidaniyalife.com/newindex/page4.jpg" class="ipic"/>
</div>
<div class="index">
    <div class="MassageBox"
         style="position: absolute;left:0;right: 0;width: 100%; height: 100%;background:white;z-index: 99999;text-align: center;display: none;">
        <p style="text-align: left;padding:5%;">留下您的建议:</p>
        <textarea id="msgTextarea"
                  style="width: 90%;height: 40%;border: 1px solid black;border-radius: 5px;outline: none;padding: 5px;margin-top: 5%;"
                  type="text" rows="3" cols="20"></textarea>
        <button id="close"
                style="width: 20%; font-size: 16px;background: white;border: 1px solid gray;border-radius: 5px;padding: 2px;margin-top: 1.2rem;">
            取消
        </button>
        <button id="send"
                style="width: 20%; font-size: 16px;background: white;border: 1px solid gray;border-radius: 5px;padding: 2px;margin-top: 1.2rem;">
            提交
        </button>
    </div>
    <div class="box1">
        <div class="zhuan">
            <img src="http://cdn.dasvidaniyalife.com/zhuan1.png" class="z1"/>
            <img src="http://cdn.dasvidaniyalife.com/zhuan3.png" class="z2"/>
        </div>
        <div id="circlr">
            <span class="gobackBoxButton" data-fist="" data-last=".index3"
                  style="display: block;padding: 10px;position: absolute;color: white;font-size: 16px;transform: rotate(90deg);top: 5%;right:-1%;z-index: 99999;">返回</span>
            <a class="msgBoxButton"
               style="display: block;padding: 10px;position: absolute;color: white;font-size: 16px;transform: rotate(90deg);bottom: 5%;right:-1%;z-index: 99999;">留言板</a>
        </div>
        <div class="container">
            <span class="gb"></span>
            <img src="http://cdn.dasvidaniyalife.com/lefttb.png" class="lefttb"/>
            <img src="http://cdn.dasvidaniyalife.com/righttb.png" class="righttb"/>
            <!--航空-->
            <div class="cbox cbox10 pbox imgX" data='ln10'
                 style="background:#fff;z-index:11;width:100%;-webkit-overflow-scrolling: touch;overflow:auto;display: block;">
                <div class="btnList2 leftBtn"
                     style="background: url(http://cdn.dasvidaniyalife.com/lefttb.png)no-repeat center;background-size: 100%;width: 0.4rem;height: 0.5rem; position: fixed;top: 0%;left: 1.6rem;webkit-animation: lmove 2s 0s infinite;animation: lmove 2s 0s infinite;display: none;"></div>
                <div class="btnList2 rightBtn"
                     style="background: url(http://cdn.dasvidaniyalife.com/righttb.png)no-repeat center;background-size: 100%;width: 0.4rem;height: 0.5rem; position: fixed;bottom: 0%;left: 1.6rem;webkit-animation: rmove 2s 0s infinite;animation: rmove 2s 0s infinite;"></div>
                <img src="http://cdn.dasvidaniyalife.com/newqj/hk.jpg" width="100%" class="spic"/>
                <img src="http://cdn.dasvidaniyalife.com/newqj/hk.jpg" width="100%" class="spic"/>
                <img src="http://cdn.dasvidaniyalife.com/bmjs/hk.jpg" data-box="cbox10" class="out_imgClass"/>
                <a href="https://www.geaviation.com/"
                   style="width:14% !important;height: 31% !important;position: absolute;z-index: 9999999 !important;top: 59% !important;left: 14% !important;display: block;"
                   class="out_imgClass"></a>
                <div style="z-index: 1;background: red;width: 0.4rem;height: 0.6rem;transform: rotate(90deg);position: absolute;top: 51%;left: 14%;background: url(http://cdn.dasvidaniyalife.com/bmjs/hand.png)no-repeat ;background-size: 100% 100%;webkit-animation: lrmove 3s 0s infinite;animation: lrmove 3s 0s infinite;"
                     class="out_imgClass" data-box="cbox10"></div>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick1 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.9rem;top: 3rem;"
                     data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick1" data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick2 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.35rem;top: 13.5rem;"
                     data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick2" data="2"/>
                <!-- <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick4 z3" style="width:1.5rem;height: 1.5rem;left: 1.23rem;top: 24.3rem;" data="4" /> -->
                <!-- <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick4" data="4" /> -->
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick5 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.34rem;top: 16.5rem;"
                     data="5"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick5" data="5"/>
                <!-- <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick6 z3" style="width:1.5rem;height: 1.5rem;left: 1.24rem;top: 20rem;" data="4" />
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick6" data="4" /> -->
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick1 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.9rem;top: 31rem !important;;"
                     data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick1"
                     style="top: 31.5rem !important;"
                     data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick2 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.35rem;top: 41rem !important;"
                     data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick2"
                     style="top: 41.5rem !important;;"
                     data="2"/>
                <!-- <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick4 z3" style="width:1.5rem;height: 1.5rem;left: 1.23rem;top: 24.3rem;" data="4" /> -->
                <!-- <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick4" data="4" /> -->
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick5 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.34rem;top: 44.5rem !important;"
                     data="5"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick5"
                     style="top: 45rem !important;"
                     data="5"/>
            </div>

            <!--智能制造-->
            <div class="cbox cbox11 pbox imgX" data='ln11'
                 style="background:#fff;z-index:11;width:100%;-webkit-overflow-scrolling: touch;overflow: auto;display: block;">
                <div class="btnList2 leftBtn"
                     style="background: url(http://cdn.dasvidaniyalife.com/lefttb.png)no-repeat center;background-size: 100%;width: 0.4rem;height: 0.5rem; position: fixed;top: 0%;left: 1.6rem;webkit-animation: lmove 3s 0s infinite;animation: lmove 3s 0s infinite;display: none;"></div>
                <div class="btnList2 rightBtn"
                     style="background: url(http://cdn.dasvidaniyalife.com/righttb.png)no-repeat center;background-size: 100%;width: 0.4rem;height: 0.5rem; position: fixed;bottom: 0%;left: 1.6rem;webkit-animation: rmove 3s 0s infinite;animation: rmove 3s 0s infinite;"></div>
                <img src="http://cdn.dasvidaniyalife.com/newqj/zn.jpg" width="100%" class="spic"/>
                <img src="http://cdn.dasvidaniyalife.com/newqj/zn.jpg" width="100%" class="spic"/>
                <img src="http://cdn.dasvidaniyalife.com/bmjs/zn.jpg" data-box="cbox11" class="out_imgClass"/>
                <div style="z-index: 1;background: red;width: 0.4rem;height: 0.6rem;transform: rotate(90deg);position: absolute;top: 51%;left: 14%;background: url(http://cdn.dasvidaniyalife.com/bmjs/hand.png)no-repeat ;background-size: 100% 100%;webkit-animation: lrmove 3s 0s infinite;animation: lrmove 3s 0s infinite;"
                     class="out_imgClass" data-box="cbox11"></div>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick1 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.15rem;top: 1.9rem;"
                     data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick1" data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick2 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.15rem;top: 16rem;"
                     data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick2" data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick3 z3"
                     style="width:1.5rem;height: 1.5rem;left:0.85rem;top: 20.5rem;"
                     data="3"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick3" data="3"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick4 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.35rem;top: 12rem;"
                     data="4"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick4" data="4"/>

                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick1 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.15rem;top:31rem;"
                     data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick1" data="1"
                     style="top: 31.5rem;"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick2 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.15rem;top: 45.4rem;"
                     data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick2" data="2"
                     style="top: 45.9rem;"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick3 z3"
                     style="width:1.5rem;height: 1.5rem;left:0.85rem;top: 49.6rem;"
                     data="3"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick3" data="3"
                     style="top: 50.1rem;"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick4 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.35rem;top: 41rem;"
                     data="4"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick4" data="4"
                     style="top: 41.5rem;"/>
            </div>

            <!--可再生能源-->
            <div class="cbox cbox12 pbox imgX" data='ln12'
                 style="background:#fff;z-index:11;width:100%;-webkit-overflow-scrolling: touch;overflow: auto;display: block;">
                <div class="btnList2 leftBtn"
                     style="background: url(http://cdn.dasvidaniyalife.com/lefttb.png)no-repeat center;background-size: 100%;width: 0.4rem;height: 0.5rem; position: fixed;top: 0%;left: 1.6rem;webkit-animation: lmove 3s 0s infinite;animation: lmove 3s 0s infinite;display: none;"></div>
                <div class="btnList2 rightBtn"
                     style="background: url(http://cdn.dasvidaniyalife.com/righttb.png)no-repeat center;background-size: 100%;width: 0.4rem;height: 0.5rem; position: fixed;bottom: 0%;left: 1.6rem;webkit-animation: rmove 3s 0s infinite;animation: rmove 3s 0s infinite;"></div>
                <a href="https://www.ge.com/renewableenergy"
                   style="width:14% !important;height: 31% !important;position: absolute;z-index: 9999999 !important;top: 59% !important;left: 14% !important;display: block;"
                   class="out_imgClass"></a>
                <div style="z-index: 1;background: red;width: 0.4rem;height: 0.6rem;transform: rotate(90deg);position: absolute;top: 51%;left: 14%;background: url(http://cdn.dasvidaniyalife.com/bmjs/hand.png)no-repeat ;background-size: 100% 100%;webkit-animation: lrmove 3s 0s infinite;animation: lrmove 3s 0s infinite;"
                     class="out_imgClass" data-box="cbox12"></div>
                <img src="http://cdn.dasvidaniyalife.com/newqj/kzs.jpg" width="100%" class="spic"/>
                <img src="http://cdn.dasvidaniyalife.com/newqj/kzs.jpg" width="100%" class="spic"/>
                <img src="http://cdn.dasvidaniyalife.com/bmjs/new/kzs.jpg" data-box="cbox12" class="out_imgClass"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick2 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.84rem;top: 3.1rem;"
                     data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick2" data="2"/>

                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick2 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.84rem;top: 33rem;"
                     data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick2" data="2"
                     style="top: 33.5rem;"/>
            </div>

            <!--医疗-->
            <div class="cbox cbox13 pbox imgX" data='ln13'
                 style="background:#fff;z-index:11;width:100%;-webkit-overflow-scrolling: touch;overflow: auto;display: block;">
                <div class="btnList2 leftBtn"
                     style="background: url(http://cdn.dasvidaniyalife.com/lefttb.png)no-repeat center;background-size: 100%;width: 0.4rem;height: 0.5rem; position: fixed;top: 0%;left: 1.6rem;webkit-animation: lmove 3s 0s infinite;animation: lmove 3s 0s infinite;display: none;"></div>
                <div class="btnList2 rightBtn"
                     style="background: url(http://cdn.dasvidaniyalife.com/righttb.png)no-repeat center;background-size: 100%;width: 0.4rem;height: 0.5rem; position: fixed;bottom: 0%;left: 1.6rem;webkit-animation: rmove 3s 0s infinite;animation: rmove 3s 0s infinite;"></div>
                <a href="http://wechat.gehealthcare.cn/home/know"
                   style="width:14% !important;height: 31% !important;position: absolute;z-index: 9999999 !important;top: 59% !important;left: 14% !important;display: block;"
                   class="out_imgClass"></a>
                <img src="http://cdn.dasvidaniyalife.com/newqj/yl.jpg" width="100%" class="spic"/>
                <img src="http://cdn.dasvidaniyalife.com/newqj/yl.jpg" width="100%" class="spic"/>
                <div style="z-index: 1;background: red;width: 0.4rem;height: 0.6rem;transform: rotate(90deg);position: absolute;top: 51%;left: 14%;background: url(http://cdn.dasvidaniyalife.com/bmjs/hand.png)no-repeat ;background-size: 100% 100%;webkit-animation: lrmove 3s 0s infinite;animation: lrmove 3s 0s infinite;"
                     class="out_imgClass" data-box="cbox13"></div>
                <img src="http://cdn.dasvidaniyalife.com/bmjs/yl.jpg" data-box="cbox13" class="out_imgClass"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick5 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.8rem;top: 5.9rem;"
                     data="3"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick5" data="3"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick2 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.8rem;top: 1rem;"
                     data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick2" data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick3 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.43rem;top: 4.5rem;"
                     data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick3" data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick4 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.65rem;top: 3.5rem;"
                     data="4"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick4" data="4"/>

                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick5 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.8rem;top: 34.1rem;"
                     data="3"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick5" data="3"
                     style="top: 34.6rem;"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick2 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.8rem;top: 29rem;"
                     data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick2" data="2"
                     style="top: 29.5rem;"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick3 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.43rem;top: 32.6rem;"
                     data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick3" data="1"
                     style="top: 33.1rem;"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick4 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.65rem;top: 31.5rem;"
                     data="4"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick4" data="4"
                     style="top: 32rem;"/>


            </div>

            <!--发电-->
            <div class="cbox cbox14 pbox imgX" data='ln14'
                 style="background:#fff;z-index:11;width:100%;-webkit-overflow-scrolling: touch;overflow: hidden auto;display: block;">
                <div class="btnList2 leftBtn"
                     style="background: url(http://cdn.dasvidaniyalife.com/lefttb.png)no-repeat center;background-size: 100%;width: 0.4rem;height: 0.5rem; position: fixed;top: 0%;left: 1.6rem;webkit-animation: lmove 3s 0s infinite;animation: lmove 3s 0s infinite;display: none;"></div>
                <div class="btnList2 rightBtn"
                     style="background: url(http://cdn.dasvidaniyalife.com/righttb.png)no-repeat center;background-size: 100%;width: 0.4rem;height: 0.5rem; position: fixed;bottom: 0%;left: 1.6rem;webkit-animation: rmove 3s 0s infinite;animation: rmove 3s 0s infinite;"></div>
                <a href="http://gepower.rfisystem.com/index.html"
                   style="width:14% !important;height: 31% !important;position: absolute;z-index: 9999999 !important;top: 59% !important;left: 14% !important;display: block;"
                   class="out_imgClass"></a>
                <div style="z-index: 1;background: red;width: 0.4rem;height: 0.6rem;transform: rotate(90deg);position: absolute;top: 51%;left: 14%;background: url(http://cdn.dasvidaniyalife.com/bmjs/hand.png)no-repeat ;background-size: 100% 100%;webkit-animation: lrmove 3s 0s infinite;animation: lrmove 3s 0s infinite;"
                     class="out_imgClass" data-box="cbox14"></div>
                <img src="http://cdn.dasvidaniyalife.com/newqj/fd.jpg" width="100%" class="spic"/>
                <img src="http://cdn.dasvidaniyalife.com/newqj/fd.jpg" width="100%" class="spic"/>
                <img src="http://cdn.dasvidaniyalife.com/bmjs/fd.jpg" data-box="cbox14" class="out_imgClass"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick1 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.25rem;top: 22rem;"
                     data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick1" data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick3 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.65rem;top:2.6rem;"
                     data="3"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick3" data="3"/>

                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick1 z3"
                     style="width:1.5rem;height: 1.5rem;left: 0.25rem;top: 49rem;"
                     data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick1" data="1"
                     style="top: 49.5rem;"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick3 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.65rem;top:29rem;"
                     data="3"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick3" data="3"
                     style="top:29.5rem;"/>

            </div>
            <!--石油天然气-->
            <div class="cbox cbox15 pbox imgX" data='ln15'
                 style="background:#fff;z-index:11;width:100%;-webkit-overflow-scrolling: touch;overflow: hidden auto;display: block;">
                <div class="btnList2 leftBtn"
                     style="background: url(http://cdn.dasvidaniyalife.com/lefttb.png)no-repeat center;background-size: 100%;width: 0.4rem;height: 0.5rem; position: fixed;top: 0%;left: 1.6rem;webkit-animation: lmove 3s 0s infinite;animation: lmove 3s 0s infinite;display: none;"></div>
                <div class="btnList2 rightBtn"
                     style="background: url(http://cdn.dasvidaniyalife.com/righttb.png)no-repeat center;background-size: 100%;width: 0.4rem;height: 0.5rem; position: fixed;bottom: 0%;left: 1.6rem;webkit-animation: rmove 3s 0s infinite;animation: rmove 3s 0s infinite;"></div>
                <a href="https://www.bhge.com/"
                   style="width:14% !important;height: 31% !important;position: absolute;z-index: 9999999 !important;top: 59% !important;left: 14% !important;display: block;"
                   class="out_imgClass"></a>
                <img src="http://cdn.dasvidaniyalife.com/newqj/sy.jpg" width="100%" class="spic"/>
                <img src="http://cdn.dasvidaniyalife.com/newqj/sy.jpg" width="100%" class="spic"/>
                <div style="z-index: 1;background: red;width: 0.4rem;height: 0.6rem;transform: rotate(90deg);position: absolute;top: 51%;left: 14%;background: url(http://cdn.dasvidaniyalife.com/bmjs/hand.png)no-repeat ;background-size: 100% 100%;webkit-animation: lrmove 3s 0s infinite;animation: lrmove 3s 0s infinite;"
                     class="out_imgClass" data-box="cbox15"></div>
                <img src="http://cdn.dasvidaniyalife.com/bmjs/sy.jpg" data-box="cbox15" class="out_imgClass"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick1 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.25rem;top: 2.3rem;"
                     data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick1" data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick2 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.35rem;top: 11.9em;"
                     data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick2" data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick3 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.15rem;top: 21.8rem;"
                     data="4"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick3" data="4"/>

                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick1 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.25rem;top: 31.2rem;"
                     data="1"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick1" data="1"
                     style="top: 31.7rem;"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick2 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.35rem;top: 41rem;"
                     data="2"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick2" data="2"
                     style="top: 41.5rem;"/>
                <img src="http://cdn.dasvidaniyalife.com/tb1.png" class="tclick tclick3 z3"
                     style="width:1.5rem;height: 1.5rem;left: 1.15rem;top: 50.7rem;"
                     data="4"/>
                <img src="http://cdn.dasvidaniyalife.com/clickcn.png" class="tclick tclick3" data="4"
                     style="top: 51.2rem;"/>
            </div>

        </div>
    </div>
    <ul class="box2">
        <span class="gb"></span>
        <li class="blist ln10" data='ln10'>
            <div class="btnList2 leftBtn"
                 style=";background: url(http://cdn.dasvidaniyalife.com/lefttb.png)no-repeat center;background-position: top; background-size: 40%;width: 0.9rem;height: 0.9rem;position: absolute;top: 0%;left: 1.4rem;z-index: 1;display: none;webkit-animation: lmove 3s 0s infinite;animation: lmove 3s 0s infinite;z-index: 11111;"></div>
            <div class="btnList2 rightBtn"
                 style="background: url(http://cdn.dasvidaniyalife.com/righttb.png)no-repeat center;background-position: bottom; background-size: 40%;width: 0.9rem;height: 0.9rem;position: absolute;bottom: 0%;left: 1.4rem;z-index: 1;display: none;webkit-animation: rmove 3s 0s infinite;animation: rmove 3s 0s infinite;z-index: 11111;"></div>

            <a href="https://www.cfmaeroengines.com/"><img src="http://cdn.dasvidaniyalife.com/product/hk/1.jpg"
                                                           data="1"
                                                           class="bpic"/></a>
            <div id="slide" class="index-slide slide" alt="star">
                <a class="img" href="https://www.geaviation.com/"><img
                            src="http://cdn.dasvidaniyalife.com/product/hk/2.jpg"
                            class="bpic" data="2"/></a>
                <a class="img" href="https://www.geaviation.com/"><img
                            src="http://cdn.dasvidaniyalife.com/product/hk/3.jpg"
                            class="bpic" data="3"/></a>
            </div>
            <div id="slide1" class="index-slide slide" alt="star">
                <a class="img" href="https://www.geaviation.com/"><img src="http://cdn.dasvidaniyalife.com/new/products/hk/5.jpg" data="5"
                             class="bpic" /></a>
                        <a class="img" href="https://www.geaviation.com/"><img src="http://cdn.dasvidaniyalife.com/newproducts/hk/4.jpg"
                             data="6" class="bpic" /></a>
            </div>
        </li>
        <li class="blist ln11" data='ln11'>
            <a href="https://www.ge.com/additive/"><img src="http://cdn.dasvidaniyalife.com/product/zn/1.jpg" data="1"
                                                        class="bpic"/></a>
            <a class="alertClass"><img src="http://cdn.dasvidaniyalife.com/products/zn/3.jpg" data="2"
                                       class="bpic"/></a>
            <a class="alertClass"><img src="http://cdn.dasvidaniyalife.com/products/zn/2.jpg" data="3"
                                       class="bpic"/></a>
            <a class="alertClass"><img src="http://cdn.dasvidaniyalife.com/products/zn/4.jpg" data="4"
                                       class="bpic"/></a>
            <div class="alertDiv"
                 style="display: none;width: 100%;height: 100%;position: absolute;left: 0;right: 0;z-index: 9999999;">
                <span class="alertClose"
                      style="position: fixed;bottom: 0.1rem;right: 0.1rem;z-index: 2;width: 0.4rem;height: 0.4rem;background: url(http://cdn.dasvidaniyalife.com/gb.png) no-repeat center center;background-size: 50%; color: transparent;"></span>
                <img src="http://cdn.dasvidaniyalife.com/mail.jpg"
                     style="width: 100%;height: 100%;position: absolute;"/>
            </div>
        </li>
        <li class="blist ln12" data='ln12'>
            <div class="btnList2 leftBtn"
                 style=";background: url(http://cdn.dasvidaniyalife.com/lefttb.png)no-repeat center;background-position: top; background-size: 40%;;width: 0.9rem;height: 0.9rem;position: absolute;top: 0%;left: 1.4rem;z-index: 1;display: none;webkit-animation: lmove 3s 0s infinite;animation: lmove 3s 0s infinite;z-index: 11111;"></div>
            <div class="btnList2 rightBtn"
                 style="background: url(http://cdn.dasvidaniyalife.com/righttb.png)no-repeat center;background-position: bottom; background-size: 40%;width: 0.9rem;height: 0.9rem;position: absolute;bottom: 0%;left: 1.4rem;z-index: 1;display: none;webkit-animation: rmove 3s 0s infinite;animation: rmove 3s 0s infinite;z-index: 11111;"></div>
            <div id="slide3" class="index-slide slide" alt="star">
                <a class="img"><img src="http://cdn.dasvidaniyalife.com/product/kzs/kzs2.jpg" data="1"
                                    class="bpic"/></a>
                <a class="img"><img src="http://cdn.dasvidaniyalife.com/product/kzs/kzs1.jpg" data="2"
                                    class="bpic"/></a>
            </div>
        </li>
        <li class="blist ln13" data='ln13'>
            <div class="btnList2 leftBtn"
                 style=";background: url(http://cdn.dasvidaniyalife.com/lefttb.png)no-repeat center;background-position: top; background-size: 40%;;width: 0.9rem;height: 0.9rem;position: absolute;top: 0%;left: 1.4rem;z-index: 1;display: none;webkit-animation: lmove 3s 0s infinite;animation: lmove 3s 0s infinite;;z-index: 11111;"></div>
            <div class="btnList2 rightBtn"
                 style="background: url(http://cdn.dasvidaniyalife.com/righttb.png)no-repeat center;background-position: bottom; background-size: 40%;width: 0.9rem;height: 0.9rem;position: absolute;bottom: 0%;left: 1.4rem;z-index: 1;display: none;webkit-animation: rmove 3s 0s infinite;animation: rmove 3s 0s infinite;z-index: 11111;"></div>
            <a class="alertClass"><img src="http://cdn.dasvidaniyalife.com/product/yl/1.jpg"
                                       data="1" class="bpic"/></a>
            <a class="alertClass"><img src="http://cdn.dasvidaniyalife.com/product/yl/2.jpg"
                                       data="2" class="bpic"/></a>
            <a class="alertClass"><img src="http://cdn.dasvidaniyalife.com/product/yl/3.jpg"
                                       data="3" class="bpic"/></a>
            <div id="slide2" class="index-slide slide" alt="star">
                <a class="img alertClass"><img src="http://cdn.dasvidaniyalife.com/product/yl/6.jpg"
                                               data="6" class="bpic"/></a>
                <a class="img alertClass"><img src="http://cdn.dasvidaniyalife.com/product/yl/5.jpg"
                                               data="5" class="bpic"/></a>
                <a class="img" href="javascript:void(0)"><img src="http://cdn.dasvidaniyalife.com/products/yl/4.jpg"
                                                              data="4"
                                                              class="bpic"/></a>
                <a class="img alertClass"><img src="http://cdn.dasvidaniyalife.com/product/yl/7.jpg"
                                               data="7" class="bpic"/></a>
                <a class="img alertClass"><img src="http://cdn.dasvidaniyalife.com/product/yl/8.jpg"
                                               data="8" class="bpic"/></a>

            </div>
            <div class="alertDiv"
                 style="display: none;width: 100%;height: 100%;position: absolute;left: 0;right: 0;z-index: 9999999;">
                <span class="alertClose"
                      style="position: fixed;bottom: 0.1rem;right: 0.1rem;z-index: 2;width: 0.4rem;height: 0.4rem;background: url(http://cdn.dasvidaniyalife.com/gb.png) no-repeat center center;background-size: 50%; color: transparent;"></span>
                <img src="http://cdn.dasvidaniyalife.com/ylcode.jpg"
                     style="width: 100%;height: 100%;position: absolute;"/>
            </div>
        </li>
        <li class="blist ln14" data='ln14'>
            <a href="http://gepower.rfisystem.com/uploads/20170517133022591bdfeea161c.pdf"><img
                        src="http://cdn.dasvidaniyalife.com/product/fd/1.jpg"
                        data="1" class="bpic"/></a>
            <a href="http://gepower.rfisystem.com/newsinfor.html"><img
                        src="http://cdn.dasvidaniyalife.com/products/fd/2.jpg"
                        data="2" class="bpic"/></a>
            <a href="http://gepower.rfisystem.com/newsinfor.html"><img
                        src="http://cdn.dasvidaniyalife.com/products/fd/2.jpg"
                        data="3" class="bpic"/></a>
        </li>
        <li class="blist ln15" data='ln15'>
            <div class="btnList2 leftBtn"
                 style=";background: url(http://cdn.dasvidaniyalife.com/lefttb.png)no-repeat center;background-position: top; background-size: 40%;;width: 0.9rem;height: 0.9rem;position: absolute;top: 0%;left: 1.4rem;z-index: 1;display: none;webkit-animation: lmove 3s 0s infinite;animation: lmove 3s 0s infinite;z-index: 11111;"></div>
            <div class="btnList2 rightBtn"
                 style="background: url(http://cdn.dasvidaniyalife.com/righttb.png)no-repeat center;background-position: bottom; background-size: 40%;width: 0.9rem;height: 0.9rem;position: absolute;bottom: 0%;left: 1.4rem;z-index: 1;display: none;webkit-animation: rmove 3s 0s infinite;animation: rmove 3s 0s infinite;z-index: 11111;"></div>
            <a href="http://info.geoilandgas.com/The-Bently-Nevada-3500-System-Refresh.html"><img
                        src="http://cdn.dasvidaniyalife.com/products/sy/1.jpg"
                        data="1" class="bpic"/></a>
            <a href="https://www.gemeasurement.com/inspection-ndt/radiography-and-computed-tomography/phoenix-nanomex-industrial-x-ray"><img
                        src="http://cdn.dasvidaniyalife.com/new/products/sy/4.jpg" data="2" class="bpic"/></a>
            <div id="slide4" class="index-slide slide" alt="star">
                <a class="img" href="https://www.bhge.com/digital"><img
                            src="http://cdn.dasvidaniyalife.com/product/sy/3.jpg"
                            data="4" class="bpic"/></a>
                <a class="img" href="https://www.bhge.com/digital/intellistream"><img
                            src="http://cdn.dasvidaniyalife.com/product/sy/2.jpg"
                            data="3" class="bpic"/></a>
            </div>
        </li>
    </ul>
</div>
<script>
    document.documentElement.addEventListener('dblclick', function (e) {
        e.preventDefault();
    });
    document.getElementsByTagName("body").width = window.screen.availWidth + "px";
    document.getElementsByTagName("body").height = window.screen.availHeight - 70 + 'px';
</script>
<script src="js/circlr.js"></script>
<script type="text/javascript">
    // 添加 旋转图
    for (var i = 20; i <= 60; i++) {
        var url1 = "http://cdn.dasvidaniyalife.com/picc/" + i + ".jpg";
        var classn1 = "on" + i;
        /*var classn2 = "on";*/
        $("#circlr").append("<div class=" + classn1 + "><div class='clist'><img class='pic' data-src=" + url1 +
            " /></div></div>");
    }
    for (var j = 1; j <= 19; j++) {
        var url2 = "http://cdn.dasvidaniyalife.com/picc/" + j + ".jpg";
        var classn2 = "on" + j;
        $("#circlr").append("<div class=" + classn2 + "><div class='clist'><img class='pic' data-src=" + url2 +
            " /></div></div>");
    }
    $("#circlr>div").addClass("on");
    $("#circlr .zhuan").removeClass("on")
    $(
        "#circlr .on26 .clist,#circlr .on27 .clist,#circlr .on28 .clist,#circlr .on29 .clist,#circlr .on30 .clist,#circlr .on31 .clist,#circlr .on32 .clist,#circlr .on33 .clist,#circlr .on34 .clist,#circlr .on35 .clist,#circlr .on36 .clist,#circlr .on37 .clist,#circlr .on38 .clist,#circlr .on39 .clist,#circlr .on40 .clist,#circlr .on41 .clist,#circlr .on42 .clist,#circlr .on43 .clist,#circlr .on44 .clist,#circlr .on45 .clist,#circlr .on46 .clist,#circlr .on47 .clist,#circlr .on48 .clist,#circlr .on49 .clist,#circlr .on50 .clist"
    ).append(
        "<div class='ln ln10' data='ln10'></div><div class='ln ln11' data='ln11'></div><div class='ln ln12' data='ln12'></div><div class='ln ln13' data='ln13'></div><div class='ln ln14' data='ln14'></div><div class='ln ln15' data='ln15'></div>"
    );
    $(
        "#circlr .on51 .clist,#circlr .on52 .clist,#circlr .on53 .clist,#circlr .on54 .clist,#circlr .on55 .clist,#circlr .on56 .clist"
    ).append(
        "<div class='ln ln10' data='ln10'></div><div class='ln ln11' data='ln11'></div><div class='ln ln12' data='ln12'></div><div class='ln ln13' data='ln13'></div><div class='ln ln14' data='ln14'></div><div class='ln ln15' data='ln15'></div>"
    );
    $("#circlr .on57 .clist,#circlr .on58 .clist,#circlr .on59 .clist,#circlr .on60 .clist").append(
        "<div class='ln ln10' data='ln10'></div><div class='ln ln11' data='ln11'></div><div class='ln ln12' data='ln12'></div><div class='ln ln13' data='ln13'></div><div class='ln ln14' data='ln14'></div><div class='ln ln15' data='ln15'></div>"
    );
    $(
        "#circlr .on1 .clist,#circlr .on2 .clist,#circlr .on3 .clist,#circlr .on4 .clist,#circlr .on5 .clist,#circlr .on6 .clist"
    ).append(
        "<div class='ln ln10' data='ln10'></div><div class='ln ln11' data='ln11'></div><div class='ln ln12' data='ln12'></div><div class='ln ln13' data='ln13'></div><div class='ln ln14' data='ln14'></div><div class='ln ln15' data='ln15'></div>"
    );
    $("#circlr .on7 .clist,#circlr .on8 .clist,#circlr .on9 .clist,#circlr .on10 .clist,#circlr .on11 .clist").append(
        "<div class='ln ln10' data='ln10'></div><div class='ln ln11' data='ln11'></div><div class='ln ln12' data='ln12'></div><div class='ln ln13' data='ln13'></div><div class='ln ln14' data='ln14'></div><div class='ln ln15' data='ln15'></div>"
    );
    $(
        "#circlr .on12 .clist,#circlr .on13 .clist,#circlr .on14 .clist,#circlr .on15 .clist,#circlr .on16 .clist,#circlr .on17 .clist,#circlr .on18 .clist,#circlr .on19 .clist,#circlr .on20 .clist,#circlr .on21 .clist,#circlr .on22 .clist,#circlr .on23 .clist,#circlr .on24 .clist,#circlr .on25 .clist"
    ).append(
        "<div class='ln ln10' data='ln10'></div><div class='ln ln11' data='ln11'></div><div class='ln ln12' data='ln12'></div><div class='ln ln13' data='ln13'></div><div class='ln ln14' data='ln14'></div><div class='ln ln15' data='ln15'></div>"
    );
    //
    //
    var crl = circlr('circlr', {
        scroll: true,
        loader: 'loader',
        vertical: true,
        reverse: true,
        cycle: false,
        playSpeed: 80

    });
    var pauseA;

    function asaidebarlist(className) {
        var touch = true; //touch=true为开启触摸滑动
        var slideNub; //轮播图片数量
        slideNub = $(className + " .img").size(); //获取轮播图片数量
        for (i = 0; i < slideNub; i++) {
            $(className + " > .img:eq(" + i + ")").attr("data-slide-imgId", i);
        }
        //根据轮播图片数量设定图片位置对应的class
        if (slideNub == 1) {
            for (i = 0; i < slideNub; i++) {
                $(className + " > .img:eq(" + i + ")").addClass("img3");
            }
        }
        if (slideNub == 2) {
            for (i = 0; i < slideNub; i++) {
                $(className + " > .img:eq(" + i + ")").addClass("img" + (i + 3));
            }
        }
        if (slideNub == 3) {
            for (i = 0; i < slideNub; i++) {
                $(className + " .img:eq(" + i + ")").addClass("img" + (i + 2));
            }
        }
        if (slideNub > 3 && slideNub < 6) {
            for (i = 0; i < slideNub; i++) {
                $(className + " .img:eq(" + i + ")").addClass("img" + (i + 1));
            }
        }
        if (slideNub >= 6) {
            for (i = 0; i < slideNub; i++) {
                if (i < 5) {
                    $(className + " .img:eq(" + i + ")").addClass("img" + (i + 1));
                } else {
                    $(className + " .img:eq(" + i + ")").addClass("img5");
                }
            }
        }
        if (touch) {
            k_touch(className);
        }
        // imgClickFy();

        //右滑动
        function right(className) {
            var fy = new Array();
            for (i = 0; i < slideNub; i++) {
                fy[i] = $("#" + className + " .img[data-slide-imgId=" + i + "]").attr("class");
            }
            for (i = 0; i < slideNub; i++) {
                if (i == 0) {
                    $("#" + className + " .img[data-slide-imgId=" + i + "]").attr("class", fy[slideNub - 1]);
                } else {
                    $("#" + className + " .img[data-slide-imgId=" + i + "]").attr("class", fy[i - 1]);
                }
            }
            // imgClickFy(className);
        }

        //左滑动
        function left(className) {
            console.log(className)
            var fy = new Array();
            for (i = 0; i < slideNub; i++) {
                fy[i] = $("#" + className + " .img[data-slide-imgId=" + i + "]").attr("class");
            }
            for (i = 0; i < slideNub; i++) {
                if (i == (slideNub - 1)) {
                    $("#" + className + " .img[data-slide-imgId=" + i + "]").attr("class", fy[0]);
                } else {
                    $("#" + className + " .img[data-slide-imgId=" + i + "]").attr("class", fy[i + 1]);
                }
            }
            // imgClickFy(className);
        }

        //轮播图片左右图片点击翻页
        function imgClickFy(className) {
            $("#" + className + " .img").removeAttr("onclick");
            $("#" + className + " .img2").attr("onclick", "left()");
            $("#" + className + " .img4").attr("onclick", "right()");
        }

        //触摸滑动模块
        function k_touch(className) {
            let str = className.replace(/\#/, "");
            var _start = 0,
                _end = 0,
                _content = document.getElementById(str);
            _content.addEventListener("touchstart", touchStart, false);
            _content.addEventListener("touchmove", touchMove, false);
            _content.addEventListener("touchend", touchEnd, false);

            function touchStart(event) {
                var touch = event.targetTouches[0];
                _start = touch.pageY;
            }

            function touchMove(event) {
                event.preventDefault();
                var touch = event.targetTouches[0];
                _end = (_start - touch.pageY);
            }

            function touchEnd(event) {
                console.log(event)
                let str = event.target.parentElement.parentElement.getAttribute("id")
                console.log(_end + ":_end")
                if (_end == 0) {
                    return
                }
                if (_end > -100) {
                    left(str);
                    _end = 0;
                }
                if (_end > 100) {
                    right(str);
                    _end = 0;
                }
            }
        }
    }

    $(function () {
        asaidebarlist("#slide");
        asaidebarlist("#slide1");
        asaidebarlist("#slide2");
        asaidebarlist("#slide3");
        asaidebarlist("#slide4");
        ///上述是 轮播
        pauseA = function () {
            console.log("A")
            $("#vedioFlv")[0].pause();
            $(".playBotton").show();
        }

        $(".gobackBoxButton").click(function (e) {
            window.event ? window.event.cancelBubble = true : e.stopPropagation();
            var last = $(this).attr("data-last");
            console.log("###")
            console.log(last);
            $(last).show();
        });

        $(".msgBoxButton").click(function () {
            $(".MassageBox").show();
        })

        $("#send").on('click', function () {
            $.ajax({
                type: "post",
                url: "http://www.dasvidaniyalife.com:3000/comment",
                async: true,
                data: {
                    name: $("#msgTextarea").val()
                },
                success: function () {
                    $(".msgBox").hide();
                    $(".msgBoxButton").show();
                    $("#msgTextarea").val('');
                    alert("提交成功")
                    $(".MassageBox").hide();
                }
            });
        })
        $("#close").click(function () {
            $(".MassageBox").hide();
        })
        $(".playBotton").click(function () {
            $("#vedioFlv")[0].play();
            $(".playBotton").hide();
        })
        $("#vedioFlv").click(function () {
            $("#vedioFlv")[0].pause();
            $(".playBotton").show();
        })

        $(".out_imgClass").click(function () {
            window.event ? window.event.cancelBubble = true : e.stopPropagation();
            if (this.tagName == "A") {
                return
            }
            $(".out_imgClass").fadeOut();
            $(".spic").show();
            $(".container .cbox").css("overflow-y", "auto");
            let str = $(this).attr("data-box");
            console.log($("." + str)[0].scrollHeight)
            let Hx = $("." + str)[0].scrollHeight / 2;
            console.log("Hx:" + Hx);
            $('.' + str).scrollTop(Hx);
            $(".tclick").css("display", "block");
        })
        $("#vedioGoBack").click(function () {
            $("#vedioFlv")[0].pause();
        })
        $(".indexButton").click(function () {
            $(".index0").fadeOut();
            $("#vedioFlv")[0].pause();

        })
        $(".index1,.index2,.index3").click(function (e) {
            window.event ? window.event.cancelBubble = true : e.stopPropagation();
            $(this).fadeOut();
        })
        $(".index3").click(function (e) {
            window.event ? window.event.cancelBubble = true : e.stopPropagation();
            $(this).fadeOut();
            crl.play();
            setTimeout(function () {
                crl.stop();
            }, 4750)
        })
        //      // 点击 框架图消失
        $(".box1 .bpic").click(function () {
            $(".box1").addClass("on");
            $(".box1 .bpic .bp2").hide();
            setTimeout(function () {
                $(".box1 .bpic").hide();
                $(".box1").removeClass("on");
            }, 1500)
        });
        //      // 点击点位图
        var wdata = null;
        $("#circlr .ln").click(function () {
            $(".spic").hide();
            $(".container .cbox").css("overflow-y", "hidden");
            $(".tclick").css("display", "none");
            $(this).siblings(".pic").addClass("on");
            $(".out_imgClass").css("display", "block");
            var Data = $(this).attr("data");
            console.log("Data:" + Data)
            wdata = $(this).attr("data");
            console.log($(this));
            console.log(wdata)
            $(".container").addClass("on");
            $(".container .cbox[data=" + Data + "]").show().siblings(".container .cbox").hide();
            var H = $(".container .cbox[data=" + Data + "] .cbox_pic").height() * 3 + $(".container .cbox[data=" + Data +
                "] .cbox_pic").height() / 4;
            $(".container>.lefttb,.container>.righttb").show();
        })
        //      // 点击全景图关闭
        $(".container>.gb").click(function () {
            $(".container>.lefttb,.container>.righttb").hide();
            var wnum = $(".container .cbox[data=" + wdata + "] .cbox_pic").length;
            if (wnum > 104) {
                for (var i = wnum; i > 104; i--) {
                    $(".container .cbox[data=" + wdata + "] .cbox_pic").eq(i).remove();
                }
            }
            $(".container .cbox").hide();
            $(".container .cbox").removeClass("on");
            $(".container").removeClass("on");
            $("#circlr .pic").removeClass("on");
            num = 4;
            hnum = 4;
        })
        $(".dj").unbind("click").bind("click", function () {
            $(".box3").show();
            var Data = $(this).attr("data");
            $(".index .box3 .list[data=" + Data + "]").addClass("on").siblings(".list").removeClass("on");
        })
        //      // 点击设备介绍

        var hklist = [];
        var Listname;
        $(".tclick").unbind("click").bind("click", function () {
            $(".box2").show();
            var Data1 = $(this).parents(".container .cbox").attr("data");
            var Data2 = $(this).attr("data");
            Listname = Data1;
            if (Data1 == "ln10") {
                if (Data2 == 2) {
                    hklist = [2, 3]
                }
                if (Data2 == 5) {
                    hklist = [5, 6]
                }
            }
            if (Data1 == "ln12") {
                hklist = [2, 1]
            }
            if (Data1 == "ln13") {
                hklist = [4, 5, 6, 7, 8]
            }
            if (Data1 == "ln15") {
                hklist = [4, 3]
            }
            $("." + Listname + "> .btnList2").each((index, data) => {
                $(data).attr("data", function () {
                    return hklist[0]
                })
            })
            $(".box2 .blist[data=" + Data1 + "]").addClass("on").siblings(".box2 .blist").removeClass("on");
            $(".box2 .blist[data=" + Data1 + "] .bpic[data=" + Data2 + "]").show().siblings(".box2 .blist[data=" + Data1 +
                "] .bpic").hide();
            $(".box2 .btnList2").hide();
            $("." + Data1 + " .btnList2[data=" + Data2 + "]").show();
            console.log(hklist)
            console.log(hklist.toString())
            console.log(hklist.toString().indexOf(Data2) >= 0)
            for (let i = 0; i < hklist.length; i++) {
                $("#slide").hide();
                $("#slide1").hide();
                $("#slide2").hide();
                $("#slide3").hide();
                $("#slide4").hide();
                if (hklist.toString().indexOf(Data2) >= 0) {
                    $(".box2 .blist[data=" + Data1 + "] .bpic[data=" + hklist[i] + "]").show();
                    if (hklist.toString() == "2,3") {
                        $("#slide").show();
                    }
                    if (hklist.toString() == "5,6") {
                        $("#slide1").show();
                    }
                    if (hklist.toString() == "4,5,6,7,8") {
                        $("#slide2").show();
                    }
                    if (hklist.toString() == "2,1") {
                        $("#slide3").show();
                    }
                    if (hklist.toString() == "4,3") {
                        $("#slide4").show();
                    }
                }
            }
        })
        $(".box2 .gb").unbind("click").bind("click", function () {
            $(".box2").hide();
            $(".box2 .blist").removeClass("on");
            $(".box2 .blist .bpic").hide();
            $(".box2 .btnList2").hide();
            console.log("Listname:" + Listname)
            $("." + Listname + "> .btnList2").each((index, data) => {
                $(data).attr("data", function () {
                    return hklist[0]
                })
            })
        })
        var i = 0
        // 				$(".leftBtn").click(function() {
        // 					console.log(hklist)
        // 					console.log($(this))
        // 					var lnNumber = $(this).parent(".blist").attr("data")
        // 					console.log(lnNumber);
        // 					let xxx = $(this).attr("data");
        // 					console.log(xxx)
        // 					console.log(hklist[hklist.length - 1]);
        // 					if (xxx == hklist[hklist.length - 1]) {
        // 						console.log("####")
        // 						$("." + lnNumber + " .bpic[data=" + hklist[i] + "]").hide();
        // 						$(this).attr("data", function() {
        // 							return hklist[0]
        // 						})
        // 						$("." + lnNumber + " .bpic[data=" + hklist[0] + "]").show();
        // 					} else {
        // 						console.log("###2")
        // 						$("." + lnNumber + " .bpic[data=" + hklist[i] + "]").hide();
        // 						i = i + 1
        // 						if (i > hklist.length - 1) {
        // 							i = 0;
        // 						}
        // 						$("." + lnNumber + " .bpic[data=" + hklist[i] + "]").show();
        // 						$(this).attr("data", function() {
        // 							return hklist[i]
        // 						})
        // 					}
        // 				})
        // 				$(".rightBtn").click(function() {
        // 					console.log(hklist)
        // 					var lnNumber = $(this).parent(".blist").attr("data")
        // 					if ($(this).attr("data") == hklist[0]) {
        // 						$("." + lnNumber + " .bpic[data=" + hklist[i] + "]").hide();
        // 						$(this).attr("data", function() {
        // 							return hklist[hklist.length - 1]
        // 						})
        // 						$("." + lnNumber + " .bpic[data=" + hklist[hklist.length - 1] + "]").show();
        // 					} else {
        // 						$("." + lnNumber + " .bpic[data=" + hklist[i] + "]").hide();
        // 						console.log("i:" + i)
        // 						i = i - 1
        // 						if (i < 0) {
        // 							i = hklist.length - 1;
        // 						}
        // 						$("." + lnNumber + " .bpic[data=" + hklist[i] + "]").show();
        // 						$(this).attr("data", function() {
        // 							return hklist[i]
        // 						})
        // 					}
        // 				})
        //
        $(".container .cbox").scroll(function () {
            var Data = $(this).attr("data");
            var H = $(this).scrollTop();
            var clintHeight = $(this).height()
            var imgheight = $(this).find(".spic").height()
            var H1 = $(this).find(".cbox_pic").height() * $(this).find(".cbox_pic").length;
            var H2 = H1 - H;
            console.log(H);
            if (H == 0 || H < 0) {
                $(this).find(".leftBtn").hide()
                // $(this).scrollTop(imgheight - clintHeight - 100);
            } else {
                $(this).find(".leftBtn").show()
            }
            console.log($(this));
            if (H == imgheight - clintHeight) {
                $(this).find(".rightBtn").hide()
                // $(this).scrollTop(100)
            } else {
                $(this).find(".rightBtn").show()
            }
        })
        $(".alertClass").each(function (i, t) {
            $(t).on('click', function () {
                console.log("#33")
                $(".alertDiv").show()
            })
        })
        $(".alertClose").click(function () {
            $(".alertDiv").hide()
        })
    })
</script>
<script type="text/javascript" src="js/pinchzoom.js"></script>
<script type="text/javascript">
    $(function () {
        $('#circlr .clist').each(function () {
            new RTP.PinchZoom($(this), {});
        });
    })
</script>
<style>
    .out_imgClass {
        width: 100%;
        position: absolute;
        top: 0;
        height: 100%;
        left: 0;
    }

    .gobackBoxButton {
        display: block;
        padding: 10px;
        position: absolute;
        color: white;
        font-size: 16px;
        transform: rotate(90deg);
        top: 5%;
        right: -1%;
        z-index: 99999;
    }
</style>
</body>

</html>
